<template>
  <div class="app-container">
    <search-form :searchFormAction="searchFormAction" @search-submit="searchSubmit"/>
    <tabs-view
      ref="tabsView"
      :headerList="headerList"
      :display-pag="true"
      :params="params"
      @tab-switch="tabSwitch"
      @get-list="getList"
    >
      <template slot="content">
        <el-table
          :data="tableData"
          border
          style="width: 100%"
        >
          <el-table-column
            prop="date"
            label="流水号"
            align="center"
          />
          <el-table-column
            prop="name"
            label="项目名称"
            align="center"
          />
          <el-table-column
            prop="province"
            label="项目类别"
            align="center"
          />
          <el-table-column
            prop="city"
            label="项目状态"
            align="center"
          />
          <el-table-column
            prop="address"
            label="最新审查类别"
            align="center"
          />
          <el-table-column
            prop="zip"
            label="具体审查类型"
            align="center"
          />
          <el-table-column
            prop="zip"
            label="审查方式"
            align="center"
          />
          <el-table-column
            prop="zip"
            label="创建时间"
            align="center"
          />
          <el-table-column
            prop="zip"
            label="审查进程"
            align="center"
          />
          <el-table-column
            label="反馈结果"
            align="center"
          />
          <el-table-column
            label="负责人"
            align="center"
          />
          <el-table-column
            label="操作"
            align="center"
          />
        </el-table>
      </template>
    </tabs-view>
  </div>
</template>

<script>
import SearchForm from '@/views/components/search-form'
import TabsView from '@/views/components/tabs-view'

export default {
  name: 'ProjectList',
  components: {
    SearchForm,
    TabsView
  },
  data() {
    return {
      tableData: [],
      params: {},
      headerList: [
        { title: '所有项目', index: 1, value: 0 },
        { title: '待审查项目', index: 2, value: 0 },
        { title: '已审查项目', index: 3, value: 0 },
        { title: '待总结项目', index: 4, value: 0 },
        { title: '结题项目', index: 5, value: 0 }
      ],
      searchFormAction: [
        {
          label: '项目类别',
          prop: 'projectType',
          placeholder: '',
          i18n: 'project.projectType',
          type: 'select',
          dictData: null,
          l_weight: '80px',
          span: 4
        },
        {
          label: '审查类别',
          prop: 'reviewType',
          placeholder: '',
          i18n: 'project.reviewType',
          type: 'select',
          dictData: [],
          l_weight: '80px',
          span: 4
        },
        {
          label: '审查方式',
          prop: 'auditSupervision',
          placeholder: '',
          i18n: 'project.auditSupervision',
          type: 'select',
          dictData: [],
          l_weight: '80px',
          span: 4
        },
        {
          label: '特殊项目筛选',
          prop: 'specialProjectScreen',
          placeholder: '',
          i18n: 'project.specialProjectScreen',
          type: 'select',
          dictData: [],
          l_weight: '120px',
          span: 5
        }
      ]
    }
  },
  methods: {
    // tab栏切换事件
    tabSwitch(index) {
      console.log(index)
    },
    searchSubmit(query) {
      this.params = query;
      Object.assign(this.params, this.$refs.tabsView.$data.queryParams);
      this.getList(this.params)
    },
    getList(params) {
      // 合并对象
      console.log(params)
    }
  }
}
</script>

<style scoped>

</style>
